#header{
    position: sticky;
    top: 0;
    z-index: 99;
    // font-size: 15px;
    .warp{
        width: 60%;
    }

    .navbar-inverse{
        background: #111;
        border-color: transparent;

        .navbar-nav > li {
            border-bottom: 3px solid transparent;
            & > a{
                color: #fff;
            }

            &:hover{
                border-bottom-color: #292929;
            }
        }
    }

    .navbar{
        margin-bottom: 0;
        border-radius: 0;
    }

    .navbar-brand{
        text-transform: uppercase;
        color: #fff;
    }
}

#footer{
    width: 100%;
    height: 22vw;
    background-image: url(../images/footer.png);
    background-size: cover;
    background-position: 0 22vw;
    &>.footer{
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.8);
        &>.footer-box{
            width: 60%;
            height: 100%;
            margin: 0 auto;
            display: flex;
            &>ul{
                flex-grow: 1;
                margin-top: 4vw;
                &>li{
                    color: #999999;
                    font-size: 0.9vw;
                    margin-bottom: .8vw;
                    &>img{
                        width: 7.5vw;
                        height: 7.5vw;
                    }
                }
                &>li:nth-child(1){
                    color: #fff;
                    font-size: 1.1vw;
                    margin-bottom: 1.5vw;
                }
            }
            &>ul:nth-child(4),&>ul:nth-child(5){
                &>li{
                    text-align: center;
                }
            }
        }
    }
}